var lis = document.querySelector('.navnav3').querySelectorAll('li');
var dn = document.querySelectorAll('.dropnav1');
var bm1 = document.querySelector('.box1');
var bm2 = document.querySelector('.box2');
var a = document.getElementsByClassName('a');
var b_box3 = document.querySelectorAll('.b_box3');

/////////////////////////////////////////////////////////////////
// bm1.onfocus=function(){
// var shift1=document.querySelector('.shiftphoto');
// shift1.style.backgroundPosition=this.backgroundPosition
// }
// var x = 17;
// var y = 16;
var x = 0;
var y = 0;
var j = 0;
// console.log(lis.length);
for (var i = 0; i < lis.length - 3; i++) {
    //74 91
    //60 70
    //560 270
    //691 347
    if (i % 3 == 0) {
        x = (i / 3) * 74;
    }
    if (i % 3 == 0) {
        y = 0;
        j = 0;
    }
    y = j * 91;
    lis[i].style.background = "-" + x + "px -" + y + "px/691px 347px url(images/elf.png) no-repeat";
    console.log('x=' + x + ' y=' + y + ' j=' + j);
    console.log(' ');
    j++;

}

function setphoto() {
    for (var i = 0; i < dn.length; i++) {
        dn[i].style.background = "0 0/100% 100% url(images/navv" + (i + 1) + ".png) no-repeat";
    }
}
setphoto();
for (var i = 0; i < a.length - 7; i++) {
    a[i].style.background = "0 0/100% 100% url(images/dian" + (i + 1) + ".png) no-repeat";
}
for (var i = 7; i < a.length; i++) {
    a[i].style.background = "0 0/100% 100% url(images/jie" + (i + 1) + ".jpg) no-repeat";
}
for (var i = 0; i < 5; i++) {

}
var b_a = document.querySelector('.goods').querySelectorAll('.b_a');
for (var i = 0; i < 8; i++) {

    b_a[i].style.background = "0 0/100% 100% url(images/tuii" + (i + 1) + ".jpg) no-repeat";
}